@itemHeight: 30*@hd;
@borderItem: 1*@hd solid #EEE9E9;
.roomplan-display2 {
  margin: 0;
  padding: 0;
  line-height: normal;
  color: @color-text-paragraph;
  background: #fff;
  .loaidng-icon {
    display: flex;
    justify-content: center;
  }
  .roomplan-table {
    // -webkit-overflow-scrolling: touch;
    height: calc(~'100% - '45*@hd);
    .table-box {
      white-space: nowrap;
      border-left: @borderItem;
      .item {
        display: inline-flex;
        height: @itemHeight;
        width: @itemHeight;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        border-bottom: @borderItem;
        border-right: @borderItem;
        .dsp-unit{
          display: inline-block;
          vertical-align: top;
          height: 30*@hd;
        }
        // .dsp-unit:hover {
        //   background: #eee !important;
        // }
      }
    }
    .roomplan-table-top{
      border-top: @borderItem;
      &-head {
        width: 100*@hd;
        height: 41*@hd;
        float: left;
        display: inline-flex;
        // justify-content: center;
        align-items: center;
        border-right: @borderItem;
        border-bottom: @borderItem;
        .wm-browser {
          width: 100%;
          margin-left: 10px;
          margin-top: 6px;
        }
      }
      &-content {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        .table-box {
          width: 100%;
          .item {
            height: 41*@hd;
          }
        }
      }
      &-content::-webkit-scrollbar {// 隐藏滚动条
        display: none;
        width: 0;
      }
    }
    .roomplan-table-box {
      overflow: hidden;
      height: calc(~'100% - '43*@hd);
      &-head {
        // height: 200*@hd;
        width: 101*@hd;
        float: left;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        .head-item {
          width: 90*@hd;
          height: 30*@hd;
          line-height: 30*@hd;
          padding-left: 10px;
          overflow: hidden;
          white-space:nowrap;
          text-overflow: ellipsis;
          border-bottom: @borderItem;
          border-right: @borderItem;
        }
        .head-item:nth-child(2){
          // height: 29px;
        }
        .head-item:first-child {
          border-top: @borderItem;
        }
      }
      &-head::-webkit-scrollbar {// 隐藏滚动条
        display: none;
        width: 0;
      }
      &-content::-webkit-scrollbar {// 隐藏滚动条
        display: none;
        width: 0;
      }
      &-content {
        -webkit-overflow-scrolling: touch;
        .table-box {
          // height: 31*@hd;
          display: flex !important;
          .item {
            flex-shrink: 0;
          }
        }
        .table-box:first-child{
          .item {
            border-top: @borderItem;
          }
        }
      }
    }
  }

  .mask {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 100;
    color: #333333;
    font-family: PingFangSC-Regular;
    background-color: @fill-mask ;
    touch-action: none;
    .mask-content {
      width: 82%;
      min-height: 315*@hd;
      margin: 0 auto;
      margin-top: 104*@hd;
      padding-left: 14*@hd;
      padding-right: 14*@hd;
      background: #FFFFFF;
      box-shadow: 0 0 4*@hd 0 rgba(0,0,0,0.50);
      border-radius: 8*@hd;
      .title{
        // border: 1*@hd solid red;
        font-size: 17*@hd;
        letter-spacing: -0.48*@hd;
        padding-top: 14*@hd;
        .titile-text {
          height: 46*@hd;
          overflow-y: scroll;
          word-break: break-all; //超出内容换行
          width: 100%;
        }
      }
      .img{
        // border: 1*@hd solid red;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 180*@hd;
      }
      .message{
        // border: 1*@hd solid red;
        margin-top: 14*@hd;
        padding-bottom: 14*@hd;
        div {
          span {
            font-size: 14*@hd;
            letter-spacing: -0.39*@hd;
          }
        }
      }
    }
    .mask-close {
      width: 40px;
      text-align: center;
      margin: 0 auto;
      margin-top: 30*@hd;
      .am-icon {
        height: 40*@hd;
        width: 40*@hd;
      }
    }
  }
}

.useDetail .useDetail-header {
  background-color: #717171;
  font-size: 16*@hd;
  text-align: center;
  line-height: 40*@hd;
  color: #FFFFFF;
  word-wrap: break-word;
}